<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title id="PageTitle"></title>
    <script>
      var width = document.documentElement.clientWidth;
      var scale = width / 375;
      var css = 'html{font-size:' +
        37.5 * scale +
        'px;}';
      document.write('<style>' + css + '</style>');
    </script>
        <script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.js"></script>
</head>
<body>
<div id="app" v-cloak >
    <music :music="BgMusic"></music>
    <func-banner :mananger='true'></func-banner>
    <div class="container">
        <form name="form">
            <header>
                <div class="banner_img">
                    <img class="bg_title_banner" :src="BannerStr">
                </div>
                <div class="both"></div>
                <div class="activity_slogan">
                    <div class="both"></div>
                    <h1 id="title">{{Title}}</h1>
                </div>
            </header>
            <main>
                <div class="w">
                    <div class="activity_countdown">
                        <p v-if="partinstatus != partinstatusall.AtActInActiveEnd">活动时间结束倒计时:
                            <span class="dynamic_time"><span>{{countDown.days}}</span>天<span>{{countDown.hours}}</span>时<span>{{countDown.minutes}}</span>分<span>{{countDown.seconds}}</span>秒</span>
                        </p>
                        <p v-if="partinstatus == partinstatusall.AtActInActiveEnd">活动已结束</p>
                    </div>
                    <div class="join_activity">
                        <div class="price_des" v-if="partinstatus==partinstatusall.JoinDone || partinstatus==partinstatusall.ParterLook || partinstatus==partinstatusall.ParterDone">
                            <div class="c_price">
                                <p>{{JoinerMsg.Name}}</p>
                                <p>第<span>{{JoinerMsg.RankMsg}}</span>名</p>
                                <p><span id="piaoshu">{{JoinerMsg.NowTickets}}</span>票</p>
                            </div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.JoinJustNow">
                            <div class="first_want_join join"  v-on:click="AlertJoinPop">我要参加</div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.JoinDone">
                            <div class="look_for_friend sendfriend" v-on:click="SendFriend">马上找朋友帮我加油</div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.ParterLook">
                            <div class="help_cut helpcut" v-on:click="TakePartIn">帮TA加油</div>
                            <div class="want_join join" v-on:click="AlertJoinPop">我要参加</div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.ParterDone">
                            <div class="help_cut helpcut" v-on:click="TakePartIn">帮TA加油</div>
                            <div class="return_mine" v-on:click="BackMine">返回我的</div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.AtActInActiveStart">
                            <div class="first_want_join">活动尚未开始，请先收藏</div>
                        </div>
                        <div class="activity_status" v-if="partinstatus==partinstatusall.AtActInActiveEnd">
                            <div class="first_want_join">活动已结束,下次趁早哦</div>
                        </div>
                    </div>
                    <g-section v-on:child-say="getReadSection" :sedata="Content"></g-section>
                    <div class="activity_des">
                        <div class="activity_des_title">
                            <h2>排行榜</h2>
                        </div>
                        <div class="activity_des_content">
                            <div class="phb">
                                <div class="bmb">
                                    <table>
                                        <tr>
                                            <th>排名</th>
                                            <th>姓名</th>
                                            <th>当前票数</th>
                                        </tr>
                                        <tr v-for="(item,index) in RankMsg">
                                            <td>{{index+1}}</td>
                                            <td>{{item.Name}}</td>
                                            <td>{{item.Ticket}}票</td>
                                        </tr>
                                    </table>
                                </div>
                            </div>

                        </div>

                        <div class="load">数据加载中,请稍后</div>
                    </div>
                    <div class="both"></div>
                    <div class="both"></div>
                    <div class="both"></div>
                </div>
            </main>
        </form>
    </div>
    <div class="both"></div>
    <div class="both"></div>
    <div class="both"></div>
    <!-- 报名弹窗 -->
    <user-join :othermsg="Other" v-on:join="UserJoinAct" v-on:back="BackMine"></user-join>

    <!-- 报名成功以及提示商家分享方法 -->
    <notice-pop :actstatus="ActStatus"></notice-pop>

    <!-- 分享标题以及副标题处弹窗 -->
    <div class="mask come-mask">
        <!-- 加油成功通知  -->
        <div class="refueling_suc_notify" >
            <div class="refueling_circle_bg"><img
                    src="../../../img/activity/collect/base_come/element_popup_light@2x.png" alt=""></div>
            <div class="refueling_circle">
                <p>您已帮他成功加油</p>
            </div>
            <div class="start_rocket" id="start_rocket"><img
                    src="../../../img/activity/collect/base_come/image_rocket.png" alt=""></div>
        </div>
    </div>

    <!-- 分享标题以及副标题处弹窗 -->
    <share-pop :sharemsg="ShareMsg"></share-pop>
    <add-msg :mobile="Mobile"></add-msg>
</div>
</body>
</html>